<template>
 <div class="rating_page">
   <head-top :head-title="question.titile" :go-back=true></head-top>
   <scroll id="scroll_section" class="scroll_container" :data="detailList">
     <section v-html="markdownText" class="markdown"></section>
   </scroll>
 </div>
</template>

<script type="text/ecmascript-6">
import headTop from 'components/header/head'
import scroll from 'components/common/scroll/scroll'
import {mapGetters} from 'vuex'
import showdown from 'showdown'
  export default {
  data(){
     return{
       detailList:[]
     }
   },
   created(){
    this.detailList.push(this.question.detail)
   },
   mounted(){
   },
   computed: {
     ...mapGetters([
       'question'
     ]),
     markdownText (){
       //Markdown 是一种轻量级的「标记语言」
       //转换markDown格式,http://www.jianshu.com/p/747d6f8dddb0
       let converter = new showdown.Converter();
       return converter.makeHtml(this.question.detail);
     }
   },
   methods: {
   },
   components:{
     scroll,
    headTop
   }
  }
</script>
<style scoped lang="scss" rel="stylesheet/scss">
@import '../../../style/mixin';
.scroll_container{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding-top: 1.95rem;
  overflow-y: auto;
}
.markdown{
  font-size: .65rem;
  padding: 0 .7rem;
  color: #666;
  padding-bottom: 2rem;
}

</style>
